<template>
	<view class="header pl20 bg-white ww100 pb20" @click="store.commit('jump',props.url)"
		:style="[{height: data.menu.bottom-data.menu.top+'px'},{paddingTop:data.menu.top+'px'}]">
		<view class="input hh100 pl20 f24 pr20 d-s-c sub" :style="[{width:data.menu.left-20+'px'}]">
			<up-icon name="search" color="#999" size="20" top="2"></up-icon>
			<text class="ml10">请输入关键词搜索</text>
		</view>
	</view>
</template>

<script setup>
	import { reactive } from 'vue';
	import { onLoad } from "@dcloudio/uni-app";
	import { useStore } from "vuex"
	const store = useStore()
	const props = defineProps({
		url: {
			type: String,
			default: '/pages/search/search'
		}
	})
	const data = reactive({
		menu: {}
	})

	function back() {
		uni.navigateBack()
	}
	onLoad((options) => {
		data.menu = uni.getMenuButtonBoundingClientRect();
		// console.log(data.menu.bottom);
	})
</script>

<style scoped lang="scss">
	.header {
		box-sizing: inherit;
		z-index: 1;

		.input {
			background-color: #f6f6f6;
			border-radius: 40rpx;
		}
	}
</style>